<script>
export default {
  name: 'MenuItem',
  functional: true,
  props: {
    icon: {
      type: String,
      default: ''
    },
    title: {
      type: String,
      default: ''
    }
  },
  render (h, context) {
    const { icon, title } = context.props
    const vnodes = []
    if (icon) {
      vnodes.push(<svg-icon icon-class={icon} style='{margin-right:10px;}'></svg-icon>)
    }

    if (title) {
      let s = <span slot="title" style="margin-left:10px;">{(title)}</span>
      vnodes.push(s)
      // vnodes.push(<span slot='title'>{(title)}</span>)
    }
    return vnodes
  },
  getSvg (name) {
    return 'home'
  }
}
</script>

<style scoped>
.sub-el-icon {
  color: currentColor;
  width: 1em;
  height: 1em;
}
</style>
